<div
	class="flex items-center -mx-4 space-x-2 overflow-x-auto overflow-y-hidden sm:justify-center flex-nowrap"
	[ngClass]="['bg' + default, 'text' + defaultInv]"
>
	<a
		class="flex items-center flex-shrink-0 px-5 py-2 border-b-4"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + neutral, 'text' + plainInv]"
	>
		Architecto
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-2 border-b-4"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + neutral, 'text' + plainInv]"
	>
		Corrupti
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-2 border-b-4"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + primary, 'text' + contrastInv]"
	>
		Excepturi
	</a>
	<a
		class="flex items-center flex-shrink-0 px-5 py-2 border-b-4"
		rel="noopener noreferrer"
		href="#"
		[ngClass]="['border' + neutral, 'text' + plainInv]"
	>
		Consectetur
	</a>
</div>
